<template>
    <section class="mysection">
        <div class="page-content">
            <div class="mod-archive">
                <div>
                    <div class="archive-time-title">2019</div>
                    <ul class="mod-archive-list">
                        <li>
                            <time class="archive-time">
                                2019-06-24
                            </time>
                            <span><i class="el-eye-open"></i><span>35</span></span>
                            <a class="archive-title" href="" title="标题1">标题1</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </section>
</template>

<script>
export default {
    
}
</script>

<style scoped>
    .page-content {
        position: relative;
        min-height: 500px;
        margin: 50px 0;
        /*padding: 60px 48px;*/
        /*background: #fff;*/
        /*-webkit-box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1);*/
        /*-moz-box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1);*/
        /*box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1);*/
    }

    .mod-archive-list li {
        line-height: 30px;
        margin-bottom: 2px;
        list-style: disc
    }

    .mod-archive-list li span {
        color: #848484;
        font-size: 12px;
        float: right
    }

    .archive-time-title {
        color: #19B5FE;
        font-family: Courier, Menlo, Monaco, Consolas, "Courier New", monospace;
        font-size: 25px
    }

    .archive-time {
        color: #666;
        font-size: 14px;
        margin-right: 10px
    }

    .mod-archive-list {
        padding-left: 30px;
        padding-top: 10px;
        padding-bottom: 30px
    }

    .archive-title {
        color: #666;
        font-size: 14px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
</style>